<template> 
    <div>
        <Form ref="formValidate" :model="formValidate" :label-width="100" :rules="ruleValidate">
         
            <FormItem label="荣誉名称" prop="honor_name.zh">
                <div @keyup.enter="handleSubmit('formValidate')">
                <Input v-model="formValidate.honor_name.zh" placeholder="荣誉名称" style="width:80%"></Input>
                </div>
            </FormItem>  
            <FormItem label="颁发单位" prop="granted_unit.zh">
                <div @keyup.enter="handleSubmit('formValidate')">
                <Input v-model="formValidate.granted_unit.zh" placeholder="颁发单位" style="width:80%"></Input>
                </div>
            </FormItem>  
            <FormItem label="获奖时间" prop="selected_time">
                <DatePicker v-model="formValidate.selected_time"  type="date"  placeholder="请选择获奖时间" style="width:100%"></DatePicker>
                <Col span="19">
                </Col>
            </FormItem> 
            <FormItem label="入选等级" prop="selected_level">
                <Select v-model="formValidate.selected_level">
                    <Option v-for="item in listDictionary.selected_level" :value="item.dictionary_id" :key="item.dictionary_id"> {{item.dictionary_name.zh?item.dictionary_name.zh:item.dictionary_name.mn}}</Option>            
                </Select>
            </FormItem>
            <FormItem label="名次" prop="ranking.zh" style="width:50%">
                <div @keyup.enter="handleSubmit('formValidate')">
                <Input v-model="formValidate.ranking.zh" placeholder="名次" style="width:80%"></Input>
                </div>
            </FormItem>
            <FormItem label="上传附件">
		        <upload ref='upload' v-if="UpImgShow" @imagess='imagess' @delone='delone'  :Universalurl='imgUrl'></upload>
            </FormItem>
            <FormItem label="是否发布" prop="hkmtb"> 
                <RadioGroup v-model="formValidate.type">
                    <Radio label="public">发布</Radio>
                    <Radio label="save">不发布</Radio>
                </RadioGroup>
            </FormItem> 

            <div style="width:90%;">
                <FormItem style="width:100%;">
                    <Button type="primary" @click="handleSubmit('formValidate')">保存</Button>
                </FormItem>
            </div>
            <div style="clear:both"></div>
            <Spin size="large" fix v-if="spinShow"></Spin>
        </Form> 

    </div>
</template>
<script>
  export default {

    props: {
        infoId: {
            type: [Boolean,String,Number],
            default: false
        },
        user_id: {
            type: [Boolean,String,Number],
            default: false
        }
    },
    components: {
        Upload: resolve => {require(['&/Authpub/Upload.vue'], resolve);},	
        
    },
    data() {
        return {
            infoUrl:`api/honor/v1/honor/lists/${this.infoId}`,//请求单条数据
            saveUrl:'',//保存接口
            saveType:null,//保存方式

            infoOld:[],//单挑请求的数据

            UpImgShow:false,
            spinShow:false,//加载动画
            listDictionary: [],//数据字典  入选等级
            imgUrl:[],

            formValidate: {
                honor_name:{//荣誉名称
                    zh:'',
                    mn:'',
                    en:'',                
                },
                granted_unit:{//颁发单位
                    zh:'',
                    mn:'',
                    en:'',                
                },
                ranking:{
                    zh:'',
                    mn:'',
                    en:'',
                },//名次
                selected_time: null,//获奖时间
                selected_level:null,//入选等级
                honor_type:1,//用户类型
                user_id:this.user_id,//学生id
                type:'public',//是否发布 
                file_cache_id:[],//附件        
            },
            ruleValidate: {
                selected_time: [
                    { required: true, type: 'date', message: '请选择获奖时间', trigger: 'change' }
                ],
                'honor_name.zh': [
                    { required: true, message: '请填写荣誉名称', trigger: 'blur' }
                ],
                'granted_unit.zh': [
                    { required: true, message: '请填写颁发单位', trigger: 'blur' }
                ],
                selected_level: [
                    { type:'number',required: true, message: '请选择入选等级', trigger: 'change' }
                ],
                'ranking.zh': [
                    { required: true, message: '请填写名次', trigger: 'blur' }
                ],
            
            },
        }
    },
    methods: {

        /************************************************************
         * 
         * 上传图片
         * 
         ************************************************************/
        imagess(val){  
            if(val.length!=0){
                this.imgUrl.push(val)
            }  
            this.formValidate.file_cache_id=val
        },

        /************************************************************
         * 
         * 删除图片
         * 
         ************************************************************/
        delone(val){
          let str=val.response.data.id
          if(val.response.data.status=='pass'){
                this.spinShow=true
                this.$http.delete(`api/honor/v1/honor/delete_pic/[${str}]`)
                .then(val=>{
                    this.imgUrl=this.imgUrl.filter(item => item.security_check_picture_id != str) 
                    this.spinShow=false 
                    this.$Message.success(val.message);      
                })
                .catch(err => {
                    if(err.code && err.code==422) {
                        this.$Message.error(err.message);
                    }
                    this.spinShow=false
                    
                })
          }
        },
        /************************************************************
         * 
         * 提交时
         * 
         ************************************************************/
        handleSubmit (name) {
            if(this.imgUrl.length==0){
                this.$Message.error("请上传附件!");
                return

            }
            this.$refs[name].validate((valid) => {
                if (valid) {       
                    this.spinShow=true//输入框禁用           
                    this.saveType(this.saveUrl,this.formValidate).then(val=>{
                        this.$emit('showParent',false)
                        this.$emit('backList',true)
                        this.$Message.success(val.message);
                        this.spinShow=false
                    }).catch(err => {
                        if (err.code && err.code == 422) {
                            this.$Message.error(err.message);
                        }
                        this.spinShow=false
                    })  
                } else {
                    this.$Message.error('表单验证失败!');
                }
            })
        },
        
        /************************************************************
         * 
         * 单条数据请求
         * 
         ************************************************************/
        infoData(){
            this.$http.get(this.infoUrl).then(val=>{   
                this.infoOld = JSON.parse(JSON.stringify(val.data))
                this.username=this.infoOld.teacher!=null ? this.infoOld.teacher.teacher_name.zh : '请选择教师'
                this.formValidate.honor_name = this.infoOld.honor_name//荣誉名称
                this.formValidate.granted_unit = this.infoOld.granted_unit//入选单位
                this.formValidate.ranking = this.infoOld.ranking//入选单位
                this.formValidate.selected_time = this.infoOld.selected_time//入选时间
                this.formValidate.selected_level = parseInt(this.infoOld.selected_level)//入选等级
                this.formValidate.user_id = this.infoOld.user_id==0 ? '' : this.infoOld.user_id.toString()//学生id
                if(this.infoOld.public_status==2){this.formValidate.type ='public'}
                if(this.infoOld.public_status==1){this.formValidate.type ='save'}//是否发布

                this.imgUrl = this.infoOld.honor_picture.map(item => {
                    let arr = {
                        security_check_picture_id:item.honor_picture_id,
                        photos_url:item.annex,
                        honor:true
                    }
                    return arr
                })
                this.UpImgShow = true
                this.spinShow=false//输入框禁用          
            }).catch(err=>{
                if(err.code && err.code==422) {
                    this.$Message.error(err.message);
                }
                this.spinShow = false;
            })
        },
            
    },
    created() {
        this.spinShow=true
        /************************************************************
         * 
         * 数据字典获取数据
         * 
         ************************************************************/
        this.$http.get('api/dictionary/v1/dictionary/pidquerys?selected_level')
            .then(val=>{   
                this.listDictionary.push(val.data)
                this.listDictionary=this.listDictionary[0];
                this.spinShow=false          
            })
            .catch(err=>{
                if(err.code && err.code==422) {
                    this.$Message.error(err.message);
                }
                this.spinShow = false;
            })

        
        if(this.infoId==false){
            // add
            this.UpImgShow=true
            this.saveUrl='api/honor/v1/honor/create'
            this.saveType=this.$http.post

        }else{
            // edit
            this.infoData();
            this.saveUrl=`api/honor/v1/honor/honor_update/${this.infoId}`
            this.saveType=this.$http.put
        }
    },
  }
</script>